﻿@using MVCWebApp.Models;
@{
    ShopEntities shops = new ShopEntities();
}
<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>

	<!-- Basic Page Needs
  ================================================== -->
	<meta charset="utf-8">
	<title>ShopFine: eCommerce Website</title>
	<meta name="description" content="">
	<meta name="author" content="Ahmed Saeed">
	<!-- Mobile Specific Metas
  ================================================== -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<!-- CSS
  ================================================== 
	<!-- add  css -->
    @Styles.Render("~/Content/my-css")
    @Scripts.Render("~/bundles/my-jqueryui")
	<!--[if lt IE 9]>
		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
		<link rel="stylesheet" href="css/font-awesome-ie7.css">
	<![endif]-->
	<!-- Favicons
	================================================== -->
	<link rel="shortcut icon" href="images/favicon.html">
	<link rel="apple-touch-icon" href="images/apple-touch-icon.html">
	<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.html">
	<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.html">
</head>

<body>

	<div id="mainContainer" class="clearfix">

		<!--begain header-->
		<header>
			<div class="upperHeader">
				<div class="container">
					<ul class="pull-right inline">
						<li><a class="invarseColor" href="#">My Account</a></li>
						<li class="divider-vertical"></li>
						<li><a class="invarseColor" href="#">My Wish List (5)</a></li>
						<li class="divider-vertical"></li>
						<li><a class="invarseColor" href="#">Shoping Cart</a></li>
						<li class="divider-vertical"></li>
						<li><a class="invarseColor" href="#">Checkout</a></li>
					</ul>
					<p>
					Welcome to ShopFine, <a href="login.html">Login</a> or <a href="register.html">Create new account</a>
					</p>
				</div><!--end container-->
			</div><!--end upperHeader-->

			<div class="middleHeader">
				<div class="container">

					<div class="middleContainer clearfix">

					<div class="siteLogo pull-left">
						<h1><a href="index-2.html">ShopFine</a></h1>
					</div>

					<div class="pull-right">
						<form method="#" action="#" class="siteSearch">
							<div class="input-append">
								<input type="text" class="span2" id="appendedInputButton" placeholder="Search...">
								<button class="btn btn-primary" type="submit" name=""><i class="icon-search"></i></button>
							</div>
						</form><!--end form-->
					</div><!--end pull-right-->

					<div class="pull-right">
						<div class="btn-group">
							<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
							    $ <span class="caret"></span>
							</a>
							
						</div>
						

						<div class="btn-group">
							<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
							    <i class="icon-shopping-cart"></i> 3 Items
							    <span class="caret"></span>
							</a>
							<div class="dropdown-menu cart-content pull-right">
								<table class="table-cart">
									<tbody>
									<tr>
										<td class="cart-product-info">
											<a href="#"><img src="img/72x72.jpg" alt="product image"></a>
											<div class="cart-product-desc">
												<p><a class="invarseColor" href="#">Foliomania the designer portfolio brochure</a></p>
												<ul class="unstyled">
													<li>Available: Yes</li>
													<li>Color: Black</li>
												</ul>
											</div>
										</td>
										<td class="cart-product-setting">
											<p><strong>1x-$500.00</strong></p>
											<a href="#" class="remove-pro" rel="tooltip" data-title="Delete"><i class="icon-trash"></i></a>
										</td>
									</tr>
									<tr>
										<td class="cart-product-info">
											<a href="#"><img src="img/72x72.jpg" alt="product image"></a>
											<div class="cart-product-desc">
												<p><a class="invarseColor" href="#">Foliomania the designer portfolio brochure</a></p>
												<ul class="unstyled">
													<li>Available: Yes</li>
													<li>Color: Black</li>
												</ul>
											</div>
										</td>
										<td class="cart-product-setting">
											<p><strong>2x-$450.00</strong></p>
											<a href="#" class="remove-pro" rel="tooltip" data-title="Delete"><i class="icon-trash"></i></a>
										</td>
									</tr>
								</tbody>
								<tfoot>
									<tr>
										<td class="cart-product-info">
											<a href="#" class="btn btn-small">Vew cart</a>
											<a href="#" class="btn btn-small btn-primary">Checkout</a>
										</td>
										<td>
											<h3>TOTAL<br>$1,598.30</h3>
										</td>
									</tr>
								</tfoot>
								</table>
							</div>
						</div>
					</div><!--end pull-right-->

					</div><!--end middleCoontainer-->

				</div><!--end container-->
			</div><!--end middleHeader-->

			<div class="mainNav">
				<div class="container">
					<div class="navbar">
					      	
				      	<ul class="nav">
				      		<li class="active"><a href="#"><i class="icon-home"></i></a></li>
				      		<li>
				      			<a href="#">Mức Giá &nbsp;<i class="icon-caret-down"></i></a>
				      			<div>
					      			<ul>
                                          <li><a href="@Url.Action("ByPrice","Product",new{id=-1})"> <span>-</span>Tất Cả</a></li>
                                          @for (int i = 8; i <= 18; i += 2)
                                          {
                                              <li><a href="@Url.Action("ByPrice","Product",new{id=i})"> <span>-</span>Dưới @i Triệu</a></li>
                                          }
                                          
					      			</ul>
					      		</div>
				      		</li>
				      		<li>
				      			<a href="#">Thương Hiệu &nbsp;<i class="icon-caret-down"></i></a>
				      			<div>
					      			<ul>
                                          @foreach (brand br in (List<brand>)ViewData["brands"])
                                          {
                                           
                                                
                                              <li><a href="@Url.Action("ByBrand","Product",new{id=br.id})"> <span>-</span>@br.name</a></li>
                                             
                                          }
					      				
					      			</ul>
					      		</div>
				      		</li>
                              @foreach (group g in (List<group>)ViewData["groups"])
                              {
                
                                 <li>
                                  @{List<feature> tf = shops.features.Where(f => f.id_group == @g.id).ToList();

                                    if (tf.Count > 0)
                                    {
                                        <a>@g.name &nbsp;<i class="icon-caret-down"></i></a>
                                       <div>
                                       <ul>
                                        @foreach (feature f in tf)
                                        {
                                               <li><a href="@Url.Action("ByGroup","Product",new{id=f.id})"> <span>-</span>@f.value</a></li>
                                        }
                                       </ul>
                                       </div>
                                       
                                    }
                                    else
                                    {
                                        <a>@g.name</a>
                                    }
                              }
                                 </li>
                                  
                              }
				      		
				      		
				      	</ul><!--end nav-->

					</div>
				</div><!--end container-->
			</div><!--end mainNav-->	
			
		</header>
		<!-- end header -->



		<div class="container">

			<!--home slider-->
             @RenderSection("home_slider", required: false)
            <!--end home slider --->



			<div class="row">

				<div class="span12">
					<div id="featuredItems">
						

						<div class="row">
							 @RenderBody()
			            </div><!--end row-->


			<div class="row">

				

				<div class="span4">
					<div id="twitterFeed">
						<div class="titleHeader clearfix">
							<h3>Twitter Feed</h3>
							<div class="pagers">
								<div class="btn-toolbar">
									<button class="btn btn-mini btn-info"><i class="icon-twitter"></i> Follow Us</button>
								</div>
							</div>
						</div><!--end titleHeader-->

						<div class="tweet">
							<!-- tweets will generate automaticlly here-->
						</div><!--end tweet-->

					</div><!--end twitterFeed-->
				</div><!--end span4-->

				<div class="span4">
					<div id="facebookFeed">
						<div class="titleHeader clearfix">
							<h3>Facebook Like</h3>
						</div><!--end titleHeader-->
					</div><!--end facebookFeed-->
				</div><!--end span4-->

			</div><!--end row-->


		</div><!--end conatiner-->


		<!--begain footer-->
		<footer>
		<div class="footerOuter">
			<div class="container">
				<div class="row-fluid">

					<div class="span6">
						<div class="titleHeader clearfix">
							<h3>Usefull Links</h3>
						</div>

						
						<div class="usefullLinks">
							<div class="row-fluid">
								<div class="span6">
									<ul class="unstyled">
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> About Us</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Delivery Information</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Privecy Police</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Tarms &amp; Condations</a></li>
									</ul>
								</div>

								<div class="span6">
									<ul class="unstyled">
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Surf Brands</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Customer Support</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Special Gifs</a></li>
										<li><a class="invarseColor" href="#"><i class="icon-caret-right"></i> Browse Site Map</a></li>
									</ul>
								</div>
							</div>
						</div>

					</div><!--end span6-->

					<div class="span3">
						<div class="titleHeader clearfix">
							<h3>Contact Info</h3>
						</div>

						<div class="contactInfo">
							<ul class="unstyled">
								<li>
									<button class="btn btn-small">
										<i class="icon-volume-up"></i>
									</button>
									Call Us: <a class="invarseColor" href="#">5246-4697-891</a>
								</li>
								<li>
									<button class="btn btn-small">
										<i class="icon-envelope-alt"></i>
									</button>
									<a class="invarseColor" href="#">shopfine@shopfine.com</a>
								</li>
								<li>
									<button class="btn btn-small">
										<i class="icon-map-marker"></i>
									</button>
									22 Avenue Park, Los Angeles
								</li>
							</ul>
						</div>

					</div><!--end span3-->

					<div class="span3">
						<div class="titleHeader clearfix">
							<h3>Newslatter</h3>
						</div>

						<div class="newslatter">
							<form method="#" action="#">
								<input class="input-block-level" type="text" name="email" value="" placeholder="Your Name..." Name="">
								<input class="input-block-level" type="text" name="email" value="" placeholder="Your E-Mail..." Name="">
								<button class="btn btn-block" type="submit" name="">Join Us Now</button>
							</form>
						</div>

					</div><!--end span3-->

				</div><!--end row-fluid-->

			</div><!--end container-->
		</div><!--end footerOuter-->

		<div class="container">
			<div class="row">
				<div class="span12">
					<ul class="payments inline pull-right">
						<li class="visia"></li>
						<li class="paypal"></li>
						<li class="electron"></li>
						<li class="discover"></li>
					</ul>
					<p>© Copyrights 2012 for shopfine.com</p>
				</div>
			</div>
		</div>
		</footer>
		<!--end footer-->

	</div><!--end mainContainer-->


	<!-- Sidebar Widget
	================================================== -->
	<div class="switcher">
		<h3>Site Switcher</h3>
		<a class="Widget-toggle-link">+</a>

		<div class="switcher-content clearfix">
			<div class="layout-switch">
				<h4>Layout Style</h4>
				<div class="btn-group">
					<a id="wide-style" class="btn">Wide</a>
	  				<a id="boxed-style" class="btn">Boxed</a>
				</div>
			</div><!--end layout-switch-->

			<div class="color-switch clearfix">
				<h4>Color Style</h4>
				<a id="orange-color" class="color-switch-link">orange</a>
				<a id="blue-color" class="color-switch-link">blue</a>
				<a id="green-color" class="color-switch-link">green</a>
				<a id="brown-color" class="color-switch-link">brown</a>
				<a id="red-color" class="color-switch-link">red</a>
			</div><!--end color-switch-->

			<div class="pattern-switch">
				<h4>BG Pattern</h4>
				<a style="background:url(img/backgrounds/retina_wood.png);">retina_wood</a>
				<a style="background:url(img/backgrounds/bgnoise_lg.png);">bgnoise_lg</a>
				<a style="background:url(img/backgrounds/purty_wood.png);">purty_wood</a>
				<a style="background:url(img/backgrounds/irongrip.png);">irongrip</a>
				<a style="background:url(img/backgrounds/low_contrast_linen.png);">low_contrast_linen</a>
				<a style="background:url(img/backgrounds/tex2res5.png);">tex2res5</a>
				<a style="background:url(img/backgrounds/wood_pattern.png);">wood_pattern</a>
			</div><!--end pattern-switch-->

		</div><!--end switcher-content-->
	</div>
	<!-- End Sidebar Widget-->


	<!-- JS
	================================================== -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
    
</body>

</html>